package xyz.labmem.app.unit

import javafx.animation.KeyFrame
import javafx.animation.KeyValue
import javafx.animation.Timeline
import javafx.beans.property.SimpleBooleanProperty
import javafx.event.ActionEvent
import javafx.geometry.Insets
import javafx.scene.control.Label
import javafx.scene.layout.*
import javafx.scene.paint.Color
import javafx.scene.text.Font
import javafx.util.Duration
import xyz.labmem.app.config.AppConfig
import xyz.labmem.util.viewRun

class MsgUnit : AnchorPane() {

    companion object {
        private var menuUnit: MsgUnit? = null

        fun getMsgUnit(): MsgUnit {
            if (menuUnit == null) {
                menuUnit = MsgUnit()
            }
            return menuUnit!!
        }
    }

    private val message = Label()
    private val wordTl = Timeline()

    init {
//        style = """
//             -fx-border-color: red;
//             -fx-border-width: 2px;
//        """.trimIndent()
        val bgImage = BackgroundImage(
            AppConfig.messageImage["notification"],
            BackgroundRepeat.NO_REPEAT,
            BackgroundRepeat.NO_REPEAT,
            BackgroundPosition.CENTER,
            BackgroundSize(500.0, 141.0, false, false, false, false)
        )
        background = Background(bgImage)
        layoutY = 50.0
        rotate = -5.0
        prefHeight = 141.0
        prefWidth = 500.0

        val mona = HBox()
        val font = Font.loadFont(AppConfig.font, 16.0)
        val mW = Label("摩")
        mW.textFill = Color.rgb(0, 0, 0)
        mW.font = font
        mona.children.add(mW)
        val oW = Label("尔")
        oW.font = font
        oW.style = "-fx-background-color: black;-fx-text-fill: white"
        HBox.setMargin(oW, Insets(0.0, 0.0, 0.0, 10.0))
        mona.children.add(oW)
        val nW = Label("加")
        nW.font = font
        nW.textFill = Color.rgb(0, 0, 0)
        HBox.setMargin(nW, Insets(0.0, 0.0, 0.0, 10.0))
        mona.children.add(nW)
        val aW = Label("纳")
        aW.font = font
        aW.style = "-fx-background-color: black;-fx-text-fill: white"
        HBox.setMargin(aW, Insets(0.0, 0.0, 0.0, 10.0))
        mona.children.add(aW)
        mona.rotate = -18.0
        mona.layoutY = 20.0
        mona.layoutX = 60.0
        children.add(mona)
        message.style = "-fx-text-fill: white"
        message.layoutX = 80.0
        message.maxWidth = 330.0
        message.maxHeight = 40.0
        fun whencb() = viewRun {
            message.isWrapText = true
            message.font = Font.loadFont(AppConfig.font, 14.0)
            message.layoutY = 60.0
        }
        message.widthProperty().addListener { _, _, s ->
            if (s.toDouble() >= 330) {
                whencb()
            }
        }
        message.heightProperty().addListener { _, _, s ->
            if (s.toDouble() >= 40) {
                whencb()
            }
        }
        children.add(message)
    }

    fun showMsg(msg: String) {
        viewRun {
            wordTl.stop()
            isVisible = true
            val done = SimpleBooleanProperty(false)
            var i = 0
            wordTl.keyFrames.setAll(
                KeyFrame(
                    Duration.seconds(.05), { _: ActionEvent ->
                        if (i < msg.length) {
                            message.text += msg[i]
                            i++
                        } else
                            done.value = true
                    }
                ),
            )
            done.addListener { _, _, value ->
                if (value) {
                    wordTl.stop()
                }
            }
            wordTl.cycleCount = Timeline.INDEFINITE

            message.text = ""
            message.isWrapText = false
            message.font = Font.loadFont(AppConfig.font, 25.0)
            message.layoutY = 64.0
            scaleY = 0.0
            Timeline(
                KeyFrame(
                    Duration.seconds(.4),
                    KeyValue(this.scaleYProperty(), 1),
                ),
                KeyFrame(
                    Duration.seconds(.1),
                    KeyValue(this.rotateProperty(), 20),
                ),
                KeyFrame(
                    Duration.seconds(.3),
                    KeyValue(this.rotateProperty(), -20),
                ),
                KeyFrame(
                    Duration.seconds(.35),
                    {
                        wordTl.play()
                    },
                    KeyValue(this.rotateProperty(), -20),
                ),
                KeyFrame(
                    Duration.seconds(.4),
                    KeyValue(this.rotateProperty(), 0),
                )
            ).play()
        }
    }

}